<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="perm" uri="/WEB-INF/tld/perm.tld"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>H+ 后台主题UI框架 - FooTable</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
   	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
	<meta http-equiv="expires" content="Wed, 26 Feb 209908:21:57 GMT"> 
    <!--[if lt IE 8]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->
    <link rel="shortcut icon" href="favicon.ico"> 
    <link href="${ctx}/static/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="${ctx}/static/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${ctx}/static/css/plugins/footable/footable.core.css" rel="stylesheet">
	<link href="${ctx}/static/css/plugins/summernote/summernote.css" rel="stylesheet">
    <link href="${ctx}/static/css/plugins/summernote/summernote-bs3.css" rel="stylesheet">
    <link href="${ctx}/static/plugins/laypage/laypage.css?v=${static_version}"  rel="stylesheet">
    <link href="${ctx}/static/css/plugins/chosen/chosen.css" rel="stylesheet">
    <link href="${ctx}/static/css/animate.min.css" rel="stylesheet">
    <link href="${ctx}/static/js/plugins/layer/laydate/laydate.css" rel="stylesheet">
    <link href="${ctx}/static/css/plugins/webuploader/webuploader.css" rel="stylesheet">
    <link href="${ctx}/static/css/style.min.css?v=4.0.0" rel="stylesheet">
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
    	<div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5 class="m-b-md">Q1 销量</h5>
                        <h2 class="text-navy">
                            <i class="fa fa-play fa-rotate-270"></i> 上升
                        </h2>
                        <small>更新时间：12天以前</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content ">
                        <h5 class="m-b-md">Q2 销量</h5>
                        <h2 class="text-navy">
                            <i class="fa fa-play fa-rotate-270"></i> 上升
                        </h2>
                        <small>更新时间：12天以前</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5 class="m-b-md">Q3 销量</h5>
                        <h2 class="text-danger">
                        	<i class="fa fa-play fa-rotate-90"></i>下降
                        </h2>
                        <small>更新时间：12天以前</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5 class="m-b-md">Q4 销量</h5>
                        <h2 class="text-danger">
                            <i class="fa fa-play fa-rotate-90"></i> 下降
                        </h2>
                        <small>更新时间：12天以前</small>
                    </div>
                </div>
            </div>

        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>本日访问量</h5>
                        <h2>198 009</h2>
                        <div id="sparkline1"></div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>本周访问量</h5>
                        <h2>65 000</h2>
                        <div id="sparkline2"></div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>本月访问量</h5>
                        <h2>680 900</h2>
                        <div id="sparkline3"></div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>平均停留时间</h5>
                        <h2>00:06:40</h2>
                        <div id="sparkline4"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>使用率</h5>
                        <h2>65%</h2>
                        <div class="progress progress-mini">
                            <div style="width: 68%;" class="progress-bar"></div>
                        </div>
                        <div class="m-t-sm small">4:32更新</div>
                    </div>
                </div>
            </div>

            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>使用率</h5>
                        <h2>50%</h2>
                        <div class="progress progress-mini">
                            <div style="width: 78%;" class="progress-bar"></div>
                        </div>
                        <div class="m-t-sm small">4:32更新</div>
                    </div>
                </div>
            </div>

            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>使用率</h5>
                        <h2>14%</h2>
                        <div class="progress progress-mini">
                            <div style="width: 38%;" class="progress-bar progress-bar-danger"></div>
                        </div>
                        <div class="m-t-sm small">4:32更新</div>
                    </div>
                </div>
            </div>

            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>使用率</h5>
                        <h2>20%</h2>
                        <div class="progress progress-mini">
                            <div style="width: 28%;" class="progress-bar progress-bar-danger"></div>
                        </div>
                        <div class="m-t-sm small">4:32更新</div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>百分比</h5>
                        <h2>42/20</h2>
                        <div class="text-center">
                            <div id="sparkline5"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>百分比</h5>
                        <h2>100/54</h2>
                        <div class="text-center">
                            <div id="sparkline6"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>百分比</h5>
                        <h2>685/211</h2>
                        <div class="text-center">
                            <div id="sparkline7"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>百分比</h5>
                        <h2>240/32</h2>
                        <div class="text-center">
                            <div id="sparkline8"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>收入</h5>
                        <h1 class="no-margins">886,200</h1>
                        <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                        <small>总收入</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>本月收入</h5>
                        <h1 class="no-margins">1 738,200</h1>
                        <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                        <small>总收入</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>本日收入</h5>
                        <h1 class="no-margins">-200,100</h1>
                        <div class="stat-percent font-bold text-danger">12% <i class="fa fa-level-down"></i></div>
                        <small>总收入</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>搜索有收入</h5>
                        <h1 class="no-margins">54,200</h1>
                        <div class="stat-percent font-bold text-danger">24% <i class="fa fa-level-down"></i></div>
                        <small>总收入</small>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>预警</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                                <tr>
                                    <td class="no-borders">
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td class="no-borders">示例 01</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td>示例 02</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td>示例 03</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>项目</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                                <tr>
                                    <td class="no-borders">
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td class="no-borders">示例 01</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td>示例 02</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-navy"></i>
                                    </td>
                                    <td>示例 03</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>消息</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                                <tr>
                                    <td class="no-borders">
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td class="no-borders"> 示例 01</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td>示例 02</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td>示例 03</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>通知</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                                <tr>
                                    <td class="no-borders">
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td class="no-borders">示例 01</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td>示例 02</td>
                                </tr>
                                <tr>
                                    <td>
                                        <i class="fa fa-circle text-danger"></i>
                                    </td>
                                    <td>示例 03</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
	    <div class="row">
	        <div class="col-sm-12">
	            <div class="ibox float-e-margins">
	                <div class="ibox-title">
	                    <h5>编辑/保存为html代码示例</h5>
	                    <button id="edit" class="btn btn-primary btn-xs m-l-sm" onclick="edit()" type="button">编辑</button>
	                    <button id="save" class="btn btn-primary  btn-xs" onclick="save()" type="button">保存</button>
	                    <div class="ibox-tools">
	                        <a class="collapse-link">
	                            <i class="fa fa-chevron-up"></i>
	                        </a>
	                        <a class="dropdown-toggle" data-toggle="dropdown" href="form_editors.html#">
	                            <i class="fa fa-wrench"></i>
	                        </a>
	                        <ul class="dropdown-menu dropdown-user">
	                            <li><a href="form_editors.html#">选项1</a>
	                            </li>
	                            <li><a href="form_editors.html#">选项2</a>
	                            </li>
	                        </ul>
	                        <a class="close-link">
	                            <i class="fa fa-times"></i>
	                        </a>
	                    </div>
	                </div>
	                <div class="ibox-content" id="eg">
	                    <div class="click2edit wrapper">
	                        <h3>你好，子涵 </h3>
	                        <p>H+是一个完全响应式，基于Bootstrap3.3.5最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术，她提供了诸多的强大的可以重新组合的UI组件，并集成了最新的jQuery版本(v2.1.1)，当然，也集成了很多功能强大，用途广泛的就jQuery插件，她可以用于所有的Web应用程序，如<b>网站管理后台</b>，<b>网站会员中心</b>，<b>CMS</b>，<b>CRM</b>，<b>OA</b>等等，当然，您也可以对她进行深度定制，以做出更强系统。</p>
	                        <p><b>当前版本：</b>v4.0.0</p>
	                        <p><b>定价：</b><span class="label label-warning">¥988（不开发票）</span></p>
	                    </div>
	                </div>
	            </div>       
	        </div>
	    </div>
	    
		<div class="row">
	      <div class="col-sm-6">
	           <div class="ibox float-e-margins">
	               <div class="ibox-title">
	                   <h5>完整验证表单</h5>
	                   <div class="ibox-tools">
	                       <a class="collapse-link">
	                           <i class="fa fa-chevron-up"></i>
	                       </a>
	                       <a class="dropdown-toggle" data-toggle="dropdown" href="form_basic.html#">
	                           <i class="fa fa-wrench"></i>
	                       </a>
	                       <ul class="dropdown-menu dropdown-user">
	                           <li><a href="form_basic.html#">选项1</a>
	                           </li>
	                           <li><a href="form_basic.html#">选项2</a>
	                           </li>
	                       </ul>
	                       <a class="close-link">
	                           <i class="fa fa-times"></i>
	                       </a>
	                   </div>
	               </div>
	               <div class="ibox-content">
               		   <div class="form-group">
                           <div class="col-sm-8 col-sm-offset-3">
                               <button class="btn btn-primary" type="submit">打开弹窗演示</button>
                           </div>
                       </div>
	                   <form class="form-horizontal m-t" id="signupForm">
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">姓氏：</label>
	                           <div class="col-sm-8">
	                               <input id="firstname" name="firstname" class="form-control" type="text">
	                               <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">名字：</label>
	                           <div class="col-sm-8">
	                               <input id="lastname" name="lastname" class="form-control" type="text" aria-required="true" aria-invalid="false" class="valid">
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">用户名：</label>
	                           <div class="col-sm-8">
	                               <input id="username" name="username" class="form-control" type="text" aria-required="true" aria-invalid="true" class="error">
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">密码：</label>
	                           <div class="col-sm-8">
	                               <input id="password" name="password" class="form-control" type="password">
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">确认密码：</label>
	                           <div class="col-sm-8">
	                               <input id="confirm_password" name="confirm_password" class="form-control" type="password">
	                               <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 请再次输入您的密码</span>
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <label class="col-sm-3 control-label">E-mail：</label>
	                           <div class="col-sm-8">
	                               <input id="email" name="email" class="form-control" type="email">
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <div class="col-sm-8 col-sm-offset-3">
	                               <div class="checkbox">
	                                   <label>
	                                       <input type="checkbox" class="checkbox" id="agree" name="agree"> 我已经认真阅读并同意《H+使用协议》
	                                   </label>
	                               </div>
	                           </div>
	                       </div>
	                       <div class="form-group">
	                           <div class="col-sm-8 col-sm-offset-3">
	                               <button class="btn btn-primary" type="submit">提交</button>
	                           </div>
	                       </div>
	                   </form>
	               </div>
	           </div>
	       </div>
	       <div class="col-sm-6">
				<div class="form-group">
		            <label class="font-noraml">基本示例</label>
		            <div class="input-group">
		                <select data-placeholder="选择省份..." class="chosen-select" style="width:350px;" tabindex="2">
		                    <option value="">请选择省份</option>
		                    <option value="110000" hassubinfo="true">北京</option>
		                    <option value="120000" hassubinfo="true">天津</option>
		                    <option value="130000" hassubinfo="true">河北省</option>
		                    <option value="140000" hassubinfo="true">山西省</option>
		                    <option value="150000" hassubinfo="true">内蒙古自治区</option>
		                    <option value="210000" hassubinfo="true">辽宁省</option>
		                    <option value="220000" hassubinfo="true">吉林省</option>
		                    <option value="230000" hassubinfo="true">黑龙江省</option>
		                    <option value="310000" hassubinfo="true">上海</option>
		                </select>
		            </div>
		        </div>
		        <div class="form-group">
		            <label class="font-noraml">多选</label>
		            <div class="input-group">
		                <select data-placeholder="选择省份" class="chosen-select" multiple style="width:350px;" tabindex="4">
		                    <option value="">请选择省份</option>
		                    <option value="110000" hassubinfo="true">北京</option>
		                    <option value="120000" hassubinfo="true">天津</option>
		                    <option value="130000" hassubinfo="true">河北省</option>
		                    <option value="140000" hassubinfo="true">山西省</option>
		                    <option value="150000" hassubinfo="true">内蒙古自治区</option>
		                    <option value="210000" hassubinfo="true">辽宁省</option>
		                    <option value="220000" hassubinfo="true">吉林省</option>
		                    <option value="230000" hassubinfo="true">黑龙江省</option>
		                </select>
		            </div>
		        </div>
		        <div class="form-group">
			        <form class="form-horizontal m-t">
		                <div class="form-group">
		                    <label class="col-sm-2 control-label">普通：</label>
		                    <div class="col-sm-10">
		                        <input value="2016-06-08 00:00:00" class="form-control layer-date" placeholder="YYYY-MM-DD hh:mm:ss" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
		                    </div>
		                </div>
		                <div class="form-group">
		                    <label class="col-sm-2 control-label">外部js调用：</label>
		                    <div class="col-sm-10">
		                        <input id="hello" class="form-control layer-date">
		                    </div>
		                </div>
		                <div class="form-group">
		                    <label class="col-sm-2 control-label">图标触发日期：</label>
		                    <div class="col-sm-10">
		                        <input placeholder="开始日期" class="form-control layer-date" id="start">
		                        <input placeholder="结束日期" class="form-control layer-date" id="end">
		                    </div>
		                </div>
		                <div class="row text-center">
                            <div class="col-sm-6 h-100 p-lg">
                                <p>基本消息</p>
                                <button class="btn btn-primary btn-sm demo1">打开示例</button>
                            </div>
                            <div class="col-sm-6 h-100 p-lg">
                                <p>成功提示 </p>
                                <button class="btn btn-success btn-sm demo2">打开示例</button>
                            </div>
                            <div class="col-sm-6 h-100 p-lg">
                                <p>警告信息</p>
                                <button class="btn btn-warning btn-sm demo3">打开示例</button>
                            </div>
                            <div class="col-sm-6 h-100 p-lg">
                                <p>通过传参可以自定义取消按钮 </p>
                                <button class="btn btn-danger btn-sm demo4">打开示例</button>
                            </div>
                        </div>
		            </form>
		        </div>
			 </div>
		  </div>
	      <div class="row">
	          <div class="col-sm-12">
	              <div class="ibox float-e-margins">
	                  <div class="ibox-title">
	                      <h5>FooTable行切换，排序，分页演示</h5>
	                      <div class="ibox-tools">
	                          <a class="collapse-link">
	                              <i class="fa fa-chevron-up"></i>
	                          </a>
	                          <a class="dropdown-toggle" data-toggle="dropdown" href="#">
	                              <i class="fa fa-wrench"></i>
	                          </a>
	                          <ul class="dropdown-menu dropdown-user">
	                              <li><a href="#">选项 01</a></li>
	                              <li><a href="#">选项 02</a></li>
	                          </ul>
	                          <a class="close-link">
	                              <i class="fa fa-times"></i>
	                          </a>
	                      </div>
	                  </div>
	                  <div class="ibox-content">
	                      <table class="footable table table-stripped toggle-arrow-tiny" data-page-size="8">
	                          <thead>
	                          <tr>
	                              <th data-toggle="true">产品</th>
	                              <th>名字</th>
	                              <th>电话</th>
	                              <th data-hide="phone">公司</th>
	                              <th data-hide="tablet">参数</th>
	                              <th data-hide="phone">采购数量</th>
	                              <th data-hide="phone">日期</th>
	                              <th data-hide="phone,tablet">日期1</th>
	                              <th data-hide="phone,tablet">日期2</th>
	                              <th data-hide="phone,tablet">日期3</th>
	                              <th data-hide="phone,tablet">日期4</th>
	                              <th data-hide="phone,tablet">日期5</th>
	                              <th data-hide="all">日期6</th>
	                              <th>操作</th>
	                          </tr>
	                          </thead>
	                          <tbody>
	                          <tr>
	                              <td>2015韩国童装韩版牛仔童短裤</td>
	                              <td>袁岳</td>
	                              <td>0800 051213</td>
	                              <td>深圳市有大福实业有限公司</td>
	                              <td><span class="pie">0.52/1.561</span></td>
	                              <td>200</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td>2015.09.10</td>
	                              <td><a href="#"><i class="fa fa-check text-navy"></i> 通过</a></td>
	                          </tr>
	                          </tbody>
	                      </table>
	                  </div>
	              </div>
	          </div>
	      </div>
	  </div>
	  
    <script src="${ctx}/static/js/jquery.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/bootstrap.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/footable/footable.all.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/validate/jquery.validate.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/validate/messages_zh.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/webuploader/webuploader.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/summernote/summernote.min.js?v=${static_version}"></script>
	<script src="${ctx}/static/js/plugins/summernote/summernote-zh-CN.js?v=${static_version}"></script>
	<script src="${ctx}/static/js/plugins/chosen/chosen.jquery.js?v=${static_version}"></script>
	<script src="${ctx}/static/js/plugins/layer/laydate/laydate.js?v=${static_version}"></script>
	<script src="${ctx}/static/js/plugins/sparkline/jquery.sparkline.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/peity/jquery.peity.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/plugins/jquery-ui/jquery-ui.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/content.min.js?v=${static_version}"></script>
    <script src="${ctx}/static/plugins/laypage/laypage.js?v=${static_version}"></script>
    <script src="${ctx}/static/common/common.js?v=${static_version}"></script>
    <script src="${ctx}/static/common/custom-datatable.js?v=${static_version}"></script>
    <script src="${ctx}/static/js/demo/peity-demo.min.js?v=${static_version}"></script>
    
    <script>
        $(document).ready(function(){
        	
        	$("#sparkline1").sparkline([34, 43, 43, 35, 44, 32, 44, 52], {
                type: "line",
                width: "100%",
                height: "60",
                lineColor: "#1ab394",
                fillColor: "#ffffff"
            });
            $("#sparkline2").sparkline([24, 43, 43, 55, 44, 62, 44, 72], {
                type: "line",
                width: "100%",
                height: "60",
                lineColor: "#1ab394",
                fillColor: "#ffffff"
            });
            $("#sparkline3").sparkline([74, 43, 23, 55, 54, 32, 24, 12], {
                type: "line",
                width: "100%",
                height: "60",
                lineColor: "#ed5565",
                fillColor: "#ffffff"
            });
            $("#sparkline4").sparkline([24, 43, 33, 55, 64, 72, 44, 22], {
                type: "line",
                width: "100%",
                height: "60",
                lineColor: "#ed5565",
                fillColor: "#ffffff"
            });
            $("#sparkline5").sparkline([1, 4], {
                type: "pie",
                height: "140",
                sliceColors: ["#1ab394", "#F5F5F5"]
            });
            $("#sparkline6").sparkline([5, 3], {
                type: "pie",
                height: "140",
                sliceColors: ["#1ab394", "#F5F5F5"]
            });
            $("#sparkline7").sparkline([2, 2], {
                type: "pie",
                height: "140",
                sliceColors: ["#ed5565", "#F5F5F5"]
            });
            $("#sparkline8").sparkline([2, 3], {
                type: "pie",
                height: "140",
                sliceColors: ["#ed5565", "#F5F5F5"]
            })
        	
        	//数据table
        	$(".footable").footable();
        	
        	//验证
        	var e = "<i class='fa fa-times-circle'></i> ";
        	
        	$("#signupForm").validate({
        		rules : {
        			firstname : "required",
        			lastname : "required",
        			username : {
        				required : !0,
        				minlength : 2
        			},
        			password : {
        				required : !0,
        				minlength : 5
        			},
        			confirm_password : {
        				required : !0,
        				minlength : 5,
        				equalTo : "#password"
        			},
        			email : {
        				required : !0,
        				email : !0
        			},
        			topic : {
        				required : "#newsletter:checked",
        				minlength : 2
        			},
        			agree : "required"
        		},
        		messages : {
        			firstname : e + "请输入你的姓",
        			lastname : e + "请输入您的名字",
        			username : {
        				required : e + "请输入您的用户名",
        				minlength : e + "用户名必须两个字符以上"
        			},
        			password : {
        				required : e + "请输入您的密码",
        				minlength : e + "密码必须5个字符以上"
        			},
        			confirm_password : {
        				required : e + "请再次输入密码",
        				minlength : e + "密码必须5个字符以上",
        				equalTo : e + "两次输入的密码不一致"
        			},
        			email : e + "请输入您的E-mail",
        			agree : {
        				required : e + "必须同意协议后才能注册",
        				element : "#agree-error"
        			}
        		}
        	}), $("#username").focus(function() {
        		var e = $("#firstname").val(), r = $("#lastname").val();
        		e && r && !this.value && (this.value = e + "." + r)
        	})
        	
        	var config = {
        	    ".chosen-select": {},
        	    ".chosen-select-deselect": {
        	        allow_single_deselect: !0
        	    },
        	    ".chosen-select-no-single": {
        	        disable_search_threshold: 10
        	    },
        	    ".chosen-select-no-results": {
        	        no_results_text: "Oops, nothing found!"
        	    },
        	    ".chosen-select-width": {
        	        width: "95%"
        	    }
        	};
        	for (var selector in config) $(selector).chosen(config[selector]);
        	
        	//drop
        	$("[class*=col]").sortable({
        		handle :".ibox-content",
        		connectWith :"[class*=col]",
        		tolerance : "pointer",
        		forcePlaceholderSize : !0,
        		opacity : .8
        	}).disableSelection()
        	
        	
        	$(".demo1").click(function() {
	            swal({
	                title: "欢迎使用SweetAlert",
	                text: "Sweet Alert 是一个替代传统的 JavaScript Alert 的漂亮提示效果。"
	            })
        	});
	        $(".demo2").click(function() {
	            swal({
	                title: "太帅了",
	                text: "小手一抖就打开了一个框",
	                type: "success"
	            })
	        });
	        $(".demo3").click(function() {
	            swal({
	                title: "您确定要删除这条信息吗",
	                text: "删除后将无法恢复，请谨慎操作！",
	                type: "warning",
	                showCancelButton: true,
	                confirmButtonColor: "#DD6B55",
	                confirmButtonText: "删除",
	                closeOnConfirm: false
	            },
	            function() {
	                swal("删除成功！", "您已经永久删除了这条信息。", "success")
	            })
	        });
	        $(".demo4").click(function() {
	            swal({
	                title: "您确定要删除这条信息吗",
	                text: "删除后将无法恢复，请谨慎操作！",
	                type: "warning",
	                showCancelButton: true,
	                confirmButtonColor: "#DD6B55",
	                confirmButtonText: "是的，我要删除！",
	                cancelButtonText: "让我再考虑一下…",
	                closeOnConfirm: false,
	                closeOnCancel: false
	            },
	            function(isConfirm) {
	                if (isConfirm) {
	                    swal("删除成功！", "您已经永久删除了这条信息。", "success")
	                } else {
	                    swal("已取消", "您取消了删除操作！", "error")
	                }
	            })
	        })
	        	
        });
        
        laydate({
            elem: "#hello",
            event: "focus"
        });
        var start = {
            elem: "#start",
            format: "YYYY/MM/DD hh:mm:ss",
            min: laydate.now(),
            max: "2099-06-16 23:59:59",
            istime: true,
            istoday: false,
            choose: function(datas) {
                end.min = datas;
                end.start = datas
            }
        };
        var end = {
            elem: "#end",
            format: "YYYY/MM/DD hh:mm:ss",
            min: laydate.now(),
            max: "2099-06-16 23:59:59",
            istime: true,
            istoday: false,
            choose: function(datas) {
                start.max = datas
            }
        };
        laydate(start);
        laydate(end);
        
        var startTime = {
            elem: "#startTime",
            format: "YYYY/MM/DD hh:mm:ss",
            min: laydate.now(),
            max: "2099-06-16 23:59:59",
            istime: true,
            istoday: false,
            choose: function(datas) {
                end.min = datas;
                end.start = datas
            }
        };
        var endTime = {
            elem: "#endTime",
            format: "YYYY/MM/DD hh:mm:ss",
            min: laydate.now(),
            max: "2099-06-16 23:59:59",
            istime: true,
            istoday: false,
            choose: function(datas) {
                start.max = datas
            }
        };
        laydate(startTime);
        laydate(endTime);

        $(document).ready(function() {
            $(".summernote").summernote({
                lang: "zh-CN"
            })
        });
        var edit = function() {
            $("#eg").addClass("no-padding");
            $(".click2edit").summernote({
                lang: "zh-CN",
                focus: true
            })
        };
        var save = function() {
            $("#eg").removeClass("no-padding");
            var aHTML = $(".click2edit").code();
            $(".click2edit").destroy()
        };
        
        
        
        </script>
</body>

</html>
